import React,{useState} from 'react';

import { Layout } from 'antd';
import SiderNav from '@/components/SiderNav'
import Top from '@/components/Top'
import { Outlet } from 'react-router-dom'

const { Header, Footer, Sider, Content } = Layout;

export default function Admin() {
  const [routeTitle,setRouteTitle] = useState("wzk")
  function editRouteTitle(val){
    setRouteTitle(val)
  }

  return (
    <Layout style={{ height: "100%" }}>
      <Sider>
        <SiderNav editRouteTitle={editRouteTitle}/>
      </Sider>

      <Layout>
        <Header style={{padding:"0"}}>
          <Top routeTitle={routeTitle}/>
        </Header>

        <Content style={{margin:"40px",backgroundColor:"#fff",padding:"20px"}}>
          <Outlet />
        </Content>

        <Footer>Footer</Footer>
      </Layout>
    </Layout>
  )
}
